import { createBrowserRouter ,  createHashRouter } from "react-router-dom";
import Login from "../page/Login";
import Article from "../page/Article";
import LayOut from "../page/LayOut";
import About from "../page/About";
import Board from "../page/Board";
import NotFound from "../page/NotFound";

const router = createBrowserRouter([
  {
    path: "/",
    element: <LayOut />,
    children: [
      {
        // 设置为默认二级路由，一级路由访问的时候，它能得到渲染，方式：去掉path，添加index:true
        // vue中默认打开二级路由，需要将二级路由的path设置为空，父组件中使用router-view标签
        index: true,
        // path: "about",
        element: <About />,
      },
      {
        path: "board",
        element: <Board />,
      },
    ],
  },
  {
    path: "/login",
    element: <Login />,
  },
  {
    path: "/article/:name/:age", // params传参，用到钩子useParams
    element: <Article />,
  },
  // 找不到也面路由配置
  {
    path: "*",
    element: <NotFound />,
  },
]);

export default router;
